import React from 'react';
import {Card, Button, notification } from 'antd';

export default class Notification extends React.Component{
    handleOnClick = (type,direction) => {
        if(direction){
            notification.config({
                placement: direction
            })
        }
        notification[type]({
            message: '发工资了,老铁',
            description: '都还花呗啦,又没啦'
        })
    };
    render() {
        return (
            <div className="wrap">
                <Card title="通知提醒框" className="wrap">
                    <Button type="primary" onClick={() => this.handleOnClick('success')}>Success</Button>
                    <Button type="primary" onClick={() => this.handleOnClick('info')}>Info</Button>
                    <Button type="primary" onClick={() => this.handleOnClick('warning')}>Warning</Button>
                    <Button type="primary" onClick={() => this.handleOnClick('error')}>Error</Button>
                </Card>
                <Card title="通知提醒框" className="wrap">
                    <Button type="primary" onClick={() => this.handleOnClick('success','topLeft')}>Success</Button>
                    <Button type="primary" onClick={() => this.handleOnClick('info','topRight')}>Info</Button>
                    <Button type="primary" onClick={() => this.handleOnClick('warning','bottomLeft')}>Warning</Button>
                    <Button type="primary" onClick={() => this.handleOnClick('error','bottomRight')}>Error</Button>
                </Card>
            </div>
        )
    }
}
